<template>
  <div class="home">
    <!-- <navbar></navbar> -->
    <!-- <nav2></nav2> -->
    <div class="sideWrap">
      <sidebar></sidebar>
    </div>
    <div class="box">
      <nav1></nav1>
      <tags></tags>
      <router-view ></router-view>
    </div>
    <!-- <copyright></copyright> -->
  </div>
</template>

<script>
import navbar from './navbar'
import sidebar from './side'
import tags from './tags'
import copyright from './copyright'
import nav1 from './navpart1'
import nav2 from './navpart2'

export default {
  name: 'HelloWorld',
  components:{
    navbar,sidebar,tags,copyright,nav1,nav2
  },
 
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style  lang="less" scoped>
@media  screen and (max-width:1500px){
  .box{
      width:85%!important;
  }
}
  .home{
    display: flex;
    .box{
      width:89%;
      // padding-left: 200px;
      // border-left: 6px solid #f5f5f5;
      // padding-top: 70px;
      // margin-bottom: 22px;
      position: fixed;
      // border: 1px solid #000;
      left: 200px;
      // top: 70px;
      height: 90%;
      box-sizing: border-box;
      // border: 2px solid yellow;
      // margin-top: 70px;
    }
  }
</style>
